<ol class="breadcrumb newcrumb">
    <li>
        <a href="#">
            <span><i class="fa fontello-home-outline"></i>
            </span>Home</a>
    </li>
    <li><a href="#">Table</a>
    </li>
    <li class="active">Simpe tables</li>
</ol>
<div class="row">
    <div class="col-md-12">
        <div class="box">
            <div class="box-header">
                <h3 class="box-title">BASIC RESPONSIVE TABLES</h3>
            </div>
            <!-- /.box-header -->
            <div class="box-body">
            <div class="table-responsive">
                <table class="table table-bordered table-striped cf">
                    <thead class="cf">
                        <tr>
                            <th>Code</th>
                            <th>Company</th>
                            <th class="numeric">Price</th>
                            <th class="numeric">Change</th>
                            <th class="numeric">Change %</th>
                            <th class="numeric">Open</th>
                            <th class="numeric">High</th>
                            <th class="numeric">Low</th>
                            <th class="numeric">Volume</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>AAC</td>
                            <td>AUSTRALIAN AGRICULTURAL COMPANY LIMITED.</td>
                            <td class="numeric">$1.38</td>
                            <td class="numeric">-0.01</td>
                            <td class="numeric">-0.36%</td>
                            <td class="numeric">$1.39</td>
                            <td class="numeric">$1.39</td>
                            <td class="numeric">$1.38</td>
                            <td class="numeric">9,395</td>
                        </tr>
                        <tr>
                            <td>AAD</td>
                            <td>ARDENT LEISURE GROUP</td>
                            <td class="numeric">$1.15</td>
                            <td class="numeric">+0.02</td>
                            <td class="numeric">1.32%</td>
                            <td class="numeric">$1.14</td>
                            <td class="numeric">$1.15</td>
                            <td class="numeric">$1.13</td>
                            <td class="numeric">56,431</td>
                        </tr>
                        <tr>
                            <td>AAX</td>
                            <td>AUSENCO LIMITED</td>
                            <td class="numeric">$4.00</td>
                            <td class="numeric">-0.04</td>
                            <td class="numeric">-0.99%</td>
                            <td class="numeric">$4.01</td>
                            <td class="numeric">$4.05</td>
                            <td class="numeric">$4.00</td>
                            <td class="numeric">90,641</td>
                        </tr>
                        <tr>
                            <td>ABC</td>
                            <td>ADELAIDE BRIGHTON LIMITED</td>
                            <td class="numeric">$3.00</td>
                            <td class="numeric">+0.06</td>
                            <td class="numeric">2.04%</td>
                            <td class="numeric">$2.98</td>
                            <td class="numeric">$3.00</td>
                            <td class="numeric">$2.96</td>
                            <td class="numeric">862,518</td>
                        </tr>
                        <tr>
                            <td>ABP</td>
                            <td>ABACUS PROPERTY GROUP</td>
                            <td class="numeric">$1.91</td>
                            <td class="numeric">0.00</td>
                            <td class="numeric">0.00%</td>
                            <td class="numeric">$1.92</td>
                            <td class="numeric">$1.93</td>
                            <td class="numeric">$1.90</td>
                            <td class="numeric">595,701</td>
                        </tr>
                        <tr>
                            <td>ABY</td>
                            <td>ADITYA BIRLA MINERALS LIMITED</td>
                            <td class="numeric">$0.77</td>
                            <td class="numeric">+0.02</td>
                            <td class="numeric">2.00%</td>
                            <td class="numeric">$0.76</td>
                            <td class="numeric">$0.77</td>
                            <td class="numeric">$0.76</td>
                            <td class="numeric">54,567</td>
                        </tr>
                        <tr>
                            <td>ACR</td>
                            <td>ACRUX LIMITED</td>
                            <td class="numeric">$3.71</td>
                            <td class="numeric">+0.01</td>
                            <td class="numeric">0.14%</td>
                            <td class="numeric">$3.70</td>
                            <td class="numeric">$3.72</td>
                            <td class="numeric">$3.68</td>
                            <td class="numeric">191,373</td>
                        </tr>
                        <tr>
                            <td>ADU</td>
                            <td>ADAMUS RESOURCES LIMITED</td>
                            <td class="numeric">$0.72</td>
                            <td class="numeric">0.00</td>
                            <td class="numeric">0.00%</td>
                            <td class="numeric">$0.73</td>
                            <td class="numeric">$0.74</td>
                            <td class="numeric">$0.72</td>
                            <td class="numeric">8,602,291</td>
                        </tr>
                        <tr>
                            <td>AGG</td>
                            <td>ANGLOGOLD ASHANTI LIMITED</td>
                            <td class="numeric">$7.81</td>
                            <td class="numeric">-0.22</td>
                            <td class="numeric">-2.74%</td>
                            <td class="numeric">$7.82</td>
                            <td class="numeric">$7.82</td>
                            <td class="numeric">$7.81</td>
                            <td class="numeric">148</td>
                        </tr>
                        <tr>
                            <td>AGK</td>
                            <td>AGL ENERGY LIMITED</td>
                            <td class="numeric">$13.82</td>
                            <td class="numeric">+0.02</td>
                            <td class="numeric">0.14%</td>
                            <td class="numeric">$13.83</td>
                            <td class="numeric">$13.83</td>
                            <td class="numeric">$13.67</td>
                            <td class="numeric">846,403</td>
                        </tr>
                        <tr>
                            <td>AGO</td>
                            <td>ATLAS IRON LIMITED</td>
                            <td class="numeric">$3.17</td>
                            <td class="numeric">-0.02</td>
                            <td class="numeric">-0.47%</td>
                            <td class="numeric">$3.11</td>
                            <td class="numeric">$3.22</td>
                            <td class="numeric">$3.10</td>
                            <td class="numeric">5,416,303</td>
                        </tr>
                    </tbody>
                </table>
                </div>
            </div>
            <!-- /.box-body -->
            <div class="box-footer clearfix">
                <ul class="pagination pagination-sm no-margin pull-right">
                    <li><a href="#">&laquo;</a>
                    </li>
                    <li><a href="#">1</a>
                    </li>
                    <li><a href="#">2</a>
                    </li>
                    <li><a href="#">3</a>
                    </li>
                    <li><a href="#">&raquo;</a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- /.box -->

        <div class="box">
            <div class="box-header">
                <h3 class="box-title">Pricing Table</h3>
            </div>
            <!-- /.box-header -->
            <div class="box-body no-padding">
                <div class="row">

                    <div class="col-md-4">
                        <div class="panel panel-danger">
                            <div class="panel-heading bg-red">
                                <h4 class="text-center">
                                    DEV PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-danger" href="http://www.jquery2dotnet.com">BUY NOW!</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-info">
                            <div class="panel-heading">
                                <h4 class="text-center">
                                    PRO PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-info" href="http://www.jquery2dotnet.com">BUY NOW!</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-success">
                            <div class="panel-heading">
                                <h4 class="text-center">
                                    FREE PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-success" href="http://www.jquery2dotnet.com">BUY
                        NOW!</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-primary">
                            <div class="panel-heading">
                                <h4 class="text-center">
                                    SILVER PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-primary" href="http://www.jquery2dotnet.com">BUY
                        NOW!</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-warning">
                            <div class="panel-heading">
                                <h4 class="text-center">
                                    GOLD PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-warning" href="http://www.jquery2dotnet.com">BUY
                        NOW!</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="text-center">
                                    PLATINUM PLAN</h4>
                            </div>
                            <div class="panel-body text-center">
                                <p class="lead">
                                    <strong>$10 / month</strong>
                                </p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Personal use</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>Unlimited projects</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>27/7 support</li>
                            </ul>
                            <div class="panel-footer">
                                <a class="btn btn-lg btn-block btn-default" href="http://www.jquery2dotnet.com">BUY
                        NOW!</a>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <!-- /.box-body -->
        </div>
        <!-- /.box -->
    </div>
    <!-- /.col -->


    <div class="col-md-12">
        <div class="box">
            <div class="box-header">
                <h3 class="box-title">Simple Full Width Table</h3>

            </div>
            <!-- /.box-header -->
            <div class="box-body">
                <div class="table-responsive">
                    <table class="table table-condensed table-hover">
                        <thead>
                            <tr>
                                <th class="bg-gray"></th>
                                <th class="bg-blue">
                                    <strong>Fluid 512</strong>
                                </th>
                                <th class="bg-aqua">
                                    <strong>Fluid 1024</strong>
                                </th>
                                <th class="bg-green">
                                    <strong>Fluid 2048</strong>
                                </th>
                                <th class="bg-red">
                                    <strong>Fluid 4096</strong>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Ram</strong>
                                </td>
                                <td class="text-blue">
                                    <h3>512
                                        <small>MB</small>
                                    </h3>
                                </td>
                                <td class="text-aqua">
                                    <h3>1024
                                        <small>MB</small>
                                    </h3>
                                </td>
                                <td class="text-green">
                                    <h3>2048
                                        <small>MB</small>
                                    </h3>
                                </td>
                                <td class="text-red">
                                    <h3>4096
                                        <small>MB</small>
                                    </h3>
                                </td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Disk Space</strong>
                                </td>
                                <th class="text-blue">25GB</td>
                                    <th class="text-aqua">50GB</td>
                                        <td class="text-green">100GB</td>
                                        <td class="text-red">200GB</td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>CPU Cores</strong>
                                </td>
                                <th class="text-blue">1</td>
                                    <th class="text-aqua">2</td>
                                        <td class="text-green">4</td>
                                        <td class="text-red">6</td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Swap</strong>
                                </td>
                                <th class="text-blue">512MB</td>
                                    <th class="text-aqua">1024MB</td>
                                        <td class="text-green">1024MB</td>
                                        <td class="text-red">2048MB</td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Bandwidth</strong>
                                </td>
                                <th class="text-blue">200GB</td>
                                    <th class="text-aqua">400GB</td>
                                        <td class="text-green">800GB</td>
                                        <td class="text-red">1600GB</td>
                            </tr>
                            <tr>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Monthly</strong>
                                </td>
                                <th class="text-blue">$16.95/month</td>
                                    <th class="text-aqua">$32.95/month</td>
                                        <td class="text-green">$64.95/month</td>
                                        <td class="text-red">$128.95/month</td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Quarterly</strong>
                                </td>
                                <th class="text-blue">$16.44/month</td>
                                    <th class="text-aqua">$31.96/month</td>
                                        <td class="text-green">$63.00/month</td>
                                        <td class="text-red">$125.08/month</td>
                            </tr>
                            <tr>
                                <td class="bg-gray">
                                    <strong>Yearly</strong>
                                </td>
                                <th class="text-blue">$15.26/month</td>
                                    <th class="text-aqua">$29.66/month</td>
                                        <td class="text-green">$58.46/month</td>
                                        <td class="text-red">$116.06/month</td>
                            </tr>
                            <tr>
                                <td></td>
                                <td><a class="btn bg-blue" href="#"><i class="fa fontello-basket"></i> Order </a>
                                </td>
                                <td><a class="btn bg-aqua" href="#"><i class="fa fontello-basket"></i> Order </a>
                                </td>
                                <td><a class="btn btn-success" href="#"><i class="fa fontello-basket"></i> Order </a>
                                </td>
                                <td><a class="btn bg-red" href="#"><i class="fa fontello-basket"></i> Order </a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- /.box-body -->
</div>
<!-- /.box -->


</div>
<!-- /.col -->
</div>
<!-- /.row -->
